<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
	<title>二维码生成</title>
    <%@include file="/WEB-INF/common/hplus-css.jsp"%>
    <%@include file="/WEB-INF/common/hplus-js.jsp" %>
    <style type="text/css">
    #required{
	color:red;
}
    </style>
</head>

<body class="gray-bg">
    <div class="wrapper wrapper-content animated fadeInRight">
        <div class="row">
            <div class="col-sm-12">
                <div class="ibox">
                    <div class="ibox-content">
                        <form action="${path}/qrcode/add" class="form-horizontal m-t" id="userForm" method="post" enctype="multipart/form-data">

                            <div class="form-group">
                                <label class="col-sm-3 control-label"><span id="required">*</span>批次号：</label>
                                <div class="col-sm-6">
                                    <input type="text" aria-required="true" id="code"  required="required" name="batch" minlength="1" maxlength="2" class="form-control" placeholder="自定义 1~2位:如 A , A1, A2, B, B1 , B2 , C ... ">
                                </div>
                            </div>
                            <div class="form-group">
                                <label class="col-sm-3 control-label"><span >*</span>数量：</label>
                                <div class="col-sm-6">
                                    <input type="text"  name="number" id="number"  class="form-control" aria-required="true"  required="required" minlength="1" maxlength="3" placeholder="输入要生成的二维码数量"
                                    onkeyup="value=value.replace(/[\u4e00-\u9fa5]/ig,'')">
                                </div>
                            </div>

                            <div class="form-group" style="text-align: center">
                                <div class="col-sm-4 col-sm-offset-3" style="text-align: center">
                                    <button class="btn btn-primary" id="add-btn" type="button">生成二维码</button>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <%@include file="/WEB-INF/common/hplus-suggest-js.jsp"%>
    <!--手机号 生分证，表单校验插件 -->
<script src="${pageContext.request.contextPath}/assets/js/validate/dist/additional-methods.js"></script>
    
    <script src="${path}/assets/hplus/js/demo/form-validate-demo.js"></script>
    <script>

            $("#add-btn").click(function() {
                $("#add-btn").attr('disabled','disabled');
            	var valid = $("#userForm").valid();
            	var num = $("#number").val();
            	if (num==0){
            	    layer.msg("数量不能为 1 ",{icon:5});
            	    return;
                }


                //loading层
                var index = layer.load(1, {
                    shade: [0.1,'#fff'] //0.1透明度的白色背景
                });

            	if(valid) {
            		$("#userForm").ajaxSubmit({
                        dataType: "json",
                        success: function (json) {
                            layer.close(index);
                            var code = json.code;
                            if(code == 0){
                            	layer.msg(json.msg, {icon: 1});
                                setTimeout(function(){
                                	window.parent.location.reload();
                                	parent.parent.layer.closeAll();
                                }, 1000);
                            }else{
                            	layer.msg(json.msg, {icon: 5,time:2000});
                            }

                            $("#add-btn").attr('disabled','');

                        },
                        error:function(){
                            layer.close(index);
                        	layer.msg('添加发生错误', {icon: 5});
                            $("#add-btn").attr('disabled','');
                        }
                    });
            	}else{
            		layer.msg("请填写完整信息！！！！", {
						icon : 5
					});
            	}
        });


    </script>

</body>
</html>
